
var chartDom = document.getElementById('line');
var myChart = echarts.init(chartDom);

let option = {
	title: {
		text: '当日充电时间段波浪图', // 标题
		top: '10',
		left: '20', // 距离左侧想像素
		textStyle: {
			color: '#FFF',
			fontWeight: 'normal',
			fontSize: '16px',
		}
	},
	grid: {
		show: true,
		left: '50',
		top: '50',
		right: '50',
		bottom: '30',
	},
	tooltip: {    // 提示框
		show: true,
		trigger: 'axis',
		triggerOn: 'mousemove|click', // 触发条件
		confine: true,    // 是否将 tooltip 框限制在图表的区域内
	},
	legend: {
		selectedMode: false, //取消图例上的点击事件
		icon: 'roundRect',
		top: '10',
		right: '20', // 图例右侧距离
		textStyle: { //图例文字的样式
			color: '#FFF',
			fontSize: '12'
		}
	},
	xAxis: {
		type: 'category',
		data: ['平时', '谷时', '尖时', '峰时', '平时'],
		boundaryGap: false,
		axisTick: {   // 刻度相关
			show: false
		},
		splitLine: {
			show: true,
			lineStyle: {
				color: "#465674"
			}
		},
		axisLine: {
			show: true,
			lineStyle: {
				color: '#465674',
			}
		},
		axisLabel: {  // 轴文字样式
			formatter: '{value}',
			show: true,
			textStyle: {
				fontSize: '10',
				color: '#fff'
			}
		},
		textStyle: {
			fontSize: '10',
			color: '#fff'
		},
		
	},
	yAxis: {
		type: 'value',
		alignTicks: true,
		splitLine: {
			show: true,
			lineStyle: {
				color: "#465674"
			}
		},
		axisLine: {
			show: true,
			lineStyle: {
				color: '#465674',
			}
		},
		axisLabel: {  // 轴文字样式
			formatter: '{value}',
			// formatter: '{value}%',
			show: true,
			textStyle: {
				fontSize: '10',
				color: '#fff'
			}
		},
		textStyle: {
			fontSize: '10',
			color: '#fff'
		},
		itemStyle: {
			normal: {
				//柱形图圆角，初始化效果
				borderRadius: [6, 6, 6, 6],
				color: new echarts.graphic.LinearGradient(
					0, 0, 0, 1,
					[{
							offset: 0,
							color: '#FF7300'
						}, //柱图渐变色
						{
							offset: 1,
							color: '#FFB228'
						}, //柱图渐变色
					]
				)
			}
		}
	},
	series: [
		{
			name: '充电量',
			data: [82, 93, 49, 33, 52],
			type: 'line',
			symbol: 'circle',
			smooth: true,
			color: '#05fdcb',
			axisLabel: {
				show: true
			},
			areaStyle: {  // 渐变
				color: {
					type: 'linear',
					x: 0,
					y: 0,
					x2: 0,
					y2: 1,
					colorStops: [{
							offset: 0, color: '#05fdcb' // 0% 处的颜色
					}, {
							offset: 1, color: 'transparent' // 100% 处的颜色
					}],
					global: false // 缺省为 false
				}
			}
		}
	]
}

function getLineData () {
      
	
}

function initLine(params) {
	option.series[0].data = [1, 2, 3, 4, 5]
	myChart.setOption(option)
}
// initLine()